import  { memo, useState,useMemo } from 'react'
import type { FC, ReactNode } from 'react'

interface IPerson {
  children?: ReactNode
}

const Main: FC<IPerson> = () => {
  const [age, setAge] = useState(0)
  const handelageadd = () => {
    console.log('ageadd')
    setAge(age + 1)
  }
  const totalcount = (num: number) => {
    let sum = 0
    for (let i = 1; i <= num; i++) {
      sum += i
    }
    console.log('function totalcounts')
    return sum
  }
  const totalUseMeno = useMemo(()=>{
    return totalcount(10)
  },[])
  return (
    <div>
      <h1>useMemo案例</h1>
      <h1>当前年龄：{age}</h1>
      <h1>当前求和：{totalUseMeno}</h1>
      <button onClick={handelageadd}>点我年龄加一</button>
    </div>
  )
}

export default memo(Main)

